<template>
  <div class="aoto">
    <el-row class="header_top">
      <el-col :span="14" class="height_gao">
        <div class="grid-content bg-purple  height_gao">
          <el-input
            placeholder="请输入要搜索的内容"
            prefix-icon="el-icon-search"
            v-model="salesman" class="input_">
          </el-input>
          <el-button type="primary" class="subang" @click="timeadd">昵称搜索</el-button>
          <el-button type="success" class="subang" @click="userphone">电话号码搜索</el-button>
        </div>
      </el-col>
      <el-col :span="10" class="height_gao">
        <div class="grid-content bg-purple-light height_gao">
          <!--<el-button type="success" class="allith2" @click="export2Excel">-->
            <!--导出业务员-->
          <!--</el-button>-->
          <el-button type="danger" class="dongjie" @click="Frozen">冻结查询</el-button>
          <el-button type="success" class="dongjieSuperior" @click="update_Superior_user = true">批量设置身份</el-button>
        </div>
      </el-col>
    </el-row>
    <div class="autd animated slideInRight">
      <el-table :data="datatitle" border style="width: 100%" v-loading="loading2" element-loading-text="拼命加载中">
        <el-table-column prop="nickname" label="用户昵称" width="150">
        </el-table-column>
        <el-table-column prop="phone" label="用户电话" width="140">
        </el-table-column>
        <el-table-column prop="pay_money" label="总消费金额" width="130">
        </el-table-column>
        <el-table-column prop="province" :formatter="user_format" label="省份" width="160">
        </el-table-column>
        <el-table-column prop="type" :formatter="user_type" label="角色" width="120">
        </el-table-column>
        <!--<el-table-column prop="userinfo.wallet" label="钱包" width="130">-->
        <!--</el-table-column>-->
        <el-table-column prop="userinfo.default_address" label="默认地址" width="225">
        </el-table-column>
        <el-table-column prop="created_at" :formatter="regist_time" label="注册时间" width="230">
        </el-table-column>
        <el-table-column
          fixed="right"
          label="操作"
          width="100">
          <template slot-scope="scope">
            <el-button @click="handleClick(scope.row)" type="text" size="small">查看详情</el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        @current-change="handleCurrentChange"
        :current-page="cur"
        :page-size="pagesize"
        :page-count="currentPage4"
        layout="total, prev, pager, next" :total="total">
      </el-pagination>
    </div>

    <el-dialog title="批量添加省份" :visible.sync="update_Superior_user">
      <superior></superior>
    </el-dialog>
  </div>
</template>
<script>
  import  superior from  "cs/public/Superior";  //修改省份
  export default {
    components: {superior},
    data() {
      return {
        update_Superior_user: false,
        salesman: '',//业务员
        pagesize: this.$store.state.attribute.page, //每页条数
        total: 1, //总条数
        currentPage4: 1, //总页数
        cur: 1, //当前页数
        loading2: true,
        searchtype: [
          'type', 'name', 'phone', 'level', 'status', 'province', 'unassigned'
        ],
        Temporary: [],  //总数据
        datatitle: [],  //当页数据
        value4: '',
        value: '',
        search: '',
      }
    },
    methods: {
      handleClick(row){  //进入详情
        this.$store.commit('SetUserinfo', row);
        this.$router.push({
          path: './userinfo'
        })
      },
      deleteRow(index, rows) {
        rows.splice(index, 1);
      },
      Frozen(){  //冻结
        this.bodyaudh(2, 4);
        this.value = 2;
        this.search = 4;
      },
      user_format(r, o, w){  //省份过滤
        return r.province || '该用户未选择';
      },
      regist_time(r){  //时间过滤
        return this.$h.formattime(r.created_at);
      },
      user_type(r){ //角色过滤
        return this.$h.user_type(r.type)
      },
//      export2Excel() {  //导出
//        var myDate = new Date();
//        let header = ['用户昵称', '用户电话', '总消费金额', '省份', '角色', '钱包', '默认地址', '注册时间'];
//        let val = ['nickname', 'phone', 'pay_money', 'province', 'type', 'userinfo.wallet', 'userinfo.default_address', 'created_at'];
//        this.$h.exportexcel(header, val, this.datatitle, '业务员' + myDate.toLocaleString())
//      },

      handleCurrentChange(val) { //分页
        this.cur = val;
        this.bodyaudh(this.value,this.search,val);
      },
      timeadd() {  //搜索
        this.bodyaudh(this.salesman, 1);
        this.value = this.salesman;
        this.search = 1;
      },
      userphone(){  //电话号码搜索
        if (this.$h.userphone_test(this.salesman, this)) {
          this.bodyaudh(this.salesman, 2);
          this.value = this.salesman;
          this.search = 2;
        }
      },
      bodyaudh(data,flag,val) {  //用户数据数据
        this.loading2 = true;
        this.http.post({
          'api': 'searchuser',
          'data': {
            'data': {
              "value": data,
              'search': this.searchtype[flag],
              'limit': this.pagesize
            }
          },
          'page':val,
        }).then((res) => {
          this.shuju(res.data);
        }, (err) => {
          if (err) {
            this.$notify.error({
              title: '错误',
              message: err.response.data.Massage
            });
          }
        })
      },

      shuju(data) {
        this.loading2 = false;
        this.total = data.total; //数据总的条数
        this.currentPage4 = data.last_page;
        this.datatitle = data.data;
      },
    },
    watch: {},
    computed: {
      //计算属性
    },
    mounted() {
      this.bodyaudh(2,0,1);
      this.value = 2;
      this.search = 0;
      //生命周期
    }
  }
</script>
<style scoped>
  .pic_css {
    height: 45%;
    width: 60%;
    margin-top: 15px;
  }

  .header_top {
    height: 80px;
    width: 100%;

  }

  .allith2 {
    background: #090404;
    float: right;
    margin-top: 15px;
  }

  .dongjie {
    background: #f6172e;
    float: right;
    margin-top: 15px;
    margin-right: 10px;
  }

  .height_gao {
    height: 80px;
  }
  .dongjieSuperior {
    background: #019c4f;
    float: right;
    margin-top: 15px;
    margin-right: 10px;
  }
  .input_ {
    width: 60%;
    margin-top: 15px;
  }

  .subang {
    margin-left: 3%;
    margin-top: 15px;
    width: 16%;
  }

  .el-row {
    margin-bottom: 20px;

  &
  :last-child {
    margin-bottom: 0;
  }

  }

</style>
